<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>慈善活动</title>

  <link href="../css/bootstrap.css" rel="stylesheet"/>
  <link href="../css/all.css" rel="stylesheet"/>
  <link href="../css/index.css" rel="stylesheet"/>
  <link href="../css/swiper-3.4.2.min.css" rel="stylesheet"/>
  <link rel="stylesheet" href="../css/layui.css" media="all"/>
  <script src="http://at.alicdn.com/t/font_631371_o7qxle1nebmg3nmi.js"></script>
  <script src="../js/jquery-2.0.3.min.js"></script>
  <script src="../js/swiper-3.4.2.min.js"></script>
  
  <script type="text/javascript">
  /*<![CDATA[*/
  var len = 6;
  var m = "{issueTime:'desc'}";
  $().ready(function(){
	  getActivityList(1,len,m);
  })
  
  
  function getFirstPage(){
	  getActivityList(1,len,m);
  }
  
	function getBackPage(){
		var now = $("#nowPage").val();
		if(now>1){
			now--;
			getActivityList(now,len,m);
		}
	}
	
	function getNextPage(){
		var now = $("#nowPage").val();
		var count = $("#countPage").val();
		if(now<count){
			now++;
			getActivityList(now,len,m);
		}
	}
	
	function getLastPage(){
		var count = $("#countPage").val();
		getActivityList(count,len,m);
	}
  
  
  function getActivityList(begin,length,jsonString){
  	$.ajax({
          url: "/activity/activityPage",
          type: "GET",
          data:{begin:begin,length:length,jsonString:jsonString},
          success: function (data) {
          	//获取activityList
          	var list = data.activityList;
          	if(list!=""){
          		var ahtml="";
        		for(var obj in list){
						ahtml+="<div class='n_m'><div class='title'>";
						ahtml+="<span>"+list[obj].issueTime+"</span>";
						ahtml+="<p class='name'><a href='../activity/"+list[obj].id+"'>"+list[obj].title+"</a></p></div>"; 
						ahtml+="<div class='des'>"+list[obj].head+"</div></div>";   
        		}
        		$('#activityDiv').html(ahtml);
          	}
          	//获取总记录数
          	var allRecord = data.allRecord;
          	//总页数
          	var countPage = (allRecord%length==0 ? allRecord/length:Math.ceil(allRecord/length));
          	//当前页数
      		$('#nowPage').val(begin);
      		$('#countPage').val(countPage);
          },
          error: function (data) {
        	  console.log("getActivityList error~");
          }
      });
  }
  /*]]>*/
  </script>
	
</head>
<body>
  <div th:include="include :: header"></div>

  <input type="hidden" id="nowPage"/><input type="hidden" id="countPage"/>
  <div class="container clear-f container-top">
    <div class="scd">
      <div class="news fl">
        <div class="news_l">
          <div class="scd_top">
            <span>全部活动</span>
            <div class="pst">
              当前位置：
              <a href="../">首页</a>-
              <a href="#">活动中心</a>
            </div>
          </div>
        </div>
        <div class="news_r">
          <div class="new_m" id="activityDiv">
          
            
            
          </div>
        </div>
        <div class="space_hx">&nbsp;</div>
        <div class="pages flex-b-cc">
          <a onclick="getFirstPage()">首页</a>
          <a onclick="getBackPage()">上一页</a>
          <a onclick="getNextPage()">下一页</a>
          <a onclick="getLastPage()">尾页</a>
        </div>
      </div>
    </div>
    <div class="sort-div fr">
        <!-- 共享排行 Start -->
        <div class="share-sort">
            <iframe src="../page/shareRank.html" height= "100%" width="100%"  frameborder="no" scrolling="No"  noresize="noresize" ></iframe>
        </div>
        <!-- 共享排行 End -->
  
        <!-- 借阅排行 Start -->
        <div class="borrow-sort">
             <iframe src="../page/borrowRank.html" height= "100%" width="100%"  frameborder="no" scrolling="No"  noresize="noresize" ></iframe>
        </div>
        <!-- 借阅排行 End -->
    </div>
  </div>

  <!-- footer Start -->
  <div th:include="include :: footer"></div>
  <!-- footer End -->

  <script type="text/javascript" src="../js/bootstrap.min.js"></script>
  <script>
    var mySwiper = new Swiper('.swiper-container', {
      pagination : '.swiper-pagination',
      paginationType : 'progress',
      autoplay: 2000,//可选选项，自动滑动
    })
  </script>
</body>

</html>
